{% load django_ledger %}
{% load i18n %}

<div class="table-container">
    <table class="table is-fullwidth is-narrow is-striped mb-3 django-ledger-table-bottom-margin-75">
        <thead>
        <tr>
            <th>Status</th>
            <th>Description</th>
            <th>Ledger</th>
            <th>Created</th>
            <th>Completed</th>
            <th>Actions</th>
        </tr>
        </thead>
        <tbody>

        {% for job in import_jobs %}
            <tr>
                <td>{{ job.status }}</td>
                <td>{{ job.description }}</td>
                <td>{{ job.ledger }}</td>
                <td>{{ job.created }}</td>
                <td>{% if job.completed %}
                    <span class="icon is-small has-text-success"><i class="icon mdi mdi-check-bold"></i></span>
                {% else %}
                    <span class="icon is-small has-text-danger"><i class="icon mdi mdi-minus-circle"></i></span>
                {% endif %}</td>
                <td>
                    <div class="dropdown is-right" id="customer-action-{{ job.uuid }}">

                        <div class="dropdown-trigger">
                            <button class="button is-small is-rounded is-outlined is-dark"
                                    aria-haspopup="true"
                                    onclick="djLedger.toggleDropdown('customer-action-{{ job.uuid }}')"
                                    aria-controls="dropdown-menu">
                                <span>Actions</span>
                                <span class="icon is-small">{% icon 'bi:arrow-down' 24 %}</span>
                            </button>
                        </div>

                        <div class="dropdown-menu"
                             id="dropdown-menu-{{ customer.uuid }}"
                             role="menu">
                            <div class="dropdown-content">
                                <a href="{% url 'django_ledger:data-import-job-txs' entity_slug=view.kwargs.entity_slug job_pk=job.uuid %}"
                                   class="dropdown-item has-text-weight-bold has-text-info">{% trans 'Manage' %}</a>
                            </div>
                        </div>
                    </div>

                </td>
            </tr>
        {% endfor %}

        </tbody>
    </table>

</div>
